import { Component, OnInit, ElementRef } from '@angular/core';
import { NavController } from '@ionic/angular';
import * as $ from 'jquery';
import { ToolService } from 'src/app/service/tool.service';
import { PopwinService } from 'src/app/service/popwin.service';
import { UrlService } from 'src/app/service/url.service';
import { ConfigService } from 'src/app/service/config.service';
import { HttpService } from 'src/app/service/http.service';
import { EventService } from 'src/app/service/event.service';
@Component({
  selector: 'app-bankadd',
  templateUrl: './bankadd.page.html',
  styleUrls: ['./bankadd.page.scss'],
})
export class BankaddPage implements OnInit {
  public province: any;//省
  private provinceStr;
  public provinceList: any[] = [];
  public city: any;//城市
  public cityList: any[] = [];
  public bankCode: any;//银行
  public bankNo: any;//银行卡号
  public bankNoRe: any;//重复的银行卡号
  public bankPosition: any;//开户网点
  public username: any;//姓名
  constructor(private navCtrl: NavController, private popWin: PopwinService, private http: HttpService, private eventS: EventService,private el:ElementRef) { }

  ngOnInit() {
    this.resetSelectStyle();
    this.getRegion();
  }

  resetSelectStyle(){
    let select_elements = (this.el.nativeElement.querySelectorAll('ion-select'));
    const styles = `
      .select-icon, .select-icon-inner {
        display: none;
      }
      .select-placeholder {
        color: #bfbfbf;
      }
    `;
    select_elements.forEach((element) => {
      this.injectStyles(element, '.select-icon', styles);
    });
  }

  injectStyles(
    shadowRootElement: HTMLElement,
    insertBeforeSelector: string,
    styles: string
  ) {
    const root = shadowRootElement.shadowRoot;
    const newStyleTag = document.createElement('style');
    newStyleTag.innerHTML = styles;
    root.insertBefore(newStyleTag, root.querySelector(insertBeforeSelector));
  }

  getRegion() {
    let that = this;
    this.getJson("assets/js/citycode.json", function (data) {
      that.provinceList = data;
    }, function (e) {

    });
  }
  /**
   * 加载本地的json文件的数据
   * @param filePath 
   * @param success 
   * @param fail 
   */
  getJson(filePath, success, fail) {
    $.ajax({ type: "get", url: filePath, dataType: "json", success: function (data) { success(data); }, error: function (e) { fail(e); } });
  }
  /**
   * 选择省的时候确定市的数据
   */
  provinceChange() {
    this.provinceStr = this.province.split('@')[0];
    this.cityList = this.provinceList[this.province.split('@')[1]].citys;
  }
  /**
   * 确定提交数据
   */
  submitBtn() {
    //  http://app.tw8999.com/static/webinfo.min.js   银行卡类型的一个json文件待处理
    if (ToolService.isEmpty(this.username)) {
      this.popWin.toast("请输入真实姓名");
      return;
    }
    if (ToolService.isEmpty(this.provinceStr)) {
      this.popWin.toast("请选择省份");
      return;
    }
    if (ToolService.isEmpty(this.city)) {
      this.popWin.toast("请选择城市");
      return;
    }
    if (ToolService.isEmpty(this.bankCode)) {
      this.popWin.toast("请选择银行");
      return;
    }
    if (ToolService.isEmpty(this.bankNo)) {
      this.popWin.toast("请输入银行卡号");
      return;
    }
    if (!ToolService.isNumber(this.bankNo)) {
      this.popWin.toast("卡号必须都为数字");
      return;
    }
    if (ToolService.isEmpty(this.bankNoRe)) {
      this.popWin.toast("请输入确认卡号");
      return;
    }
    if (this.bankNo != this.bankNoRe) {
      this.popWin.toast("两次输入的卡号不一致");
      return;
    }
    if (ToolService.isEmpty(this.bankPosition)) {
      this.popWin.toast("两次输入开户网点");
      return;
    }
    this.submit();
  }

  submit() {
    let that = this;
    let obj = "{\"bankcode\":\"" + this.bankCode + "\",\"username\":\"" + this.username + "\",\"card\":\"" + this.bankNo + "\",\"prvcode\":\"" + this.provinceStr + "\",\"citycode\":\"" + this.city + "\",\"addr\":\"" + this.bankPosition + "\"}";
    this.http.get(UrlService.USER_EDITUSERBANK, { "callback": "JSONP_CALLBACK", "data": ToolService.aesEncode(obj) }).subscribe(res => {
      let data = res.json();
      ToolService.setEncrypt(data.encrypt);
      if (data.code == ConfigService.SUCCESS_CODE) {
        let tt = ToolService.aesDecodeToJson(data.data);
        that.backClick();
        that.popWin.toast(data.message);
        that.eventS.publish("showBankList");
      } else if (data.code == ConfigService.FAIL_CODE) {
        that.popWin.toast(data.message);
      } else if (data.code == ConfigService.LOGIN_CODE) {
        that.navCtrl.navigateForward("/login");
      }
    }, error => {
      console.log("error", error);
    });
  }


  backClick() {
    this.navCtrl.back();
  }




}
